import React from 'react'
import LoginFormPart from './loginFormPart/LoginFormPart'

import './login.less'
import './css/animate.css'
import bubble1 from "./images/login-bg-bubble-01.png"
import bubble2 from "./images/login-bg-bubble-02.png"
import bubble3 from "./images/login-bg-bubble-03.png"
import bubble4 from "./images/login-bg-bubble-04.png"

function Login(){

    return (
        <div className="login-page">
            <div className="bg-bubble">
                <img src={bubble1} alt="login-bg-bubble" />
                <img src={bubble2} alt="login-bg-bubble" />
                <img src={bubble3} alt="login-bg-bubble" />
                <img src={bubble4} alt="login-bg-bubble" />
            </div>

            <div className="logo-and-slogan">

                <span className="slogan">偶遇京城无人茶室</span>

            </div>
            <div className="login-content">
                <LoginFormPart />

            </div>
        </div>
    );
}

export default Login;